<!--安排提货，订单列表-->
<template>
  <div class="contain">
    <div class="listhead-fix">
      <div class="m-sech-wrap mr20">
          <router-link to='/search?type=customDelivery' class="m-sech-box displayflex">
          <i class="iconfont icon-search"></i>
          <div class="flex1 m-sech-ipt">
              <div class="txt">{{sechTxt || '输入客户名称或单号'}}</div>
          </div>
          </router-link>
      </div>
      <!--tab-->
      <div class="lltab mb10 ft14">
        <tab bar-active-color="#77babd" 
             defaultColor="#333333"
             active-color="#77babd"
             :line-width='2'>
          <tab-item selected
            @on-item-click="goLink('1')">全部</tab-item>
          <tab-item  
            @on-item-click="goLink('2')">待提货</tab-item>
          <tab-item 
            @on-item-click="goLink('3')">已提货</tab-item>
        </tab>
      </div>
    </div>
    
    <scroller lock-x scrollbar-y use-pullup height="-180" 
              class='scroller-wrap' 
              @on-pullup-loading="loadMore1"
              v-if="todolist.length>0"
              :pullup-config="{
                              content: loadTxt,
                              downContent: '上拉加载',
                              height: 32,
                              loadingContent: '加载中...',
                              upContent: '上拉加载',
                            }"
              ref="Scroller">
      <div class="acpt-list">
        <div class="acpt-list-wrap mb30"  v-for="item in todolist">
          <div class="acpt-list-head cf">
            <span class="time f-l">{{item.BillDate | timeshort}}</span>
            <em class="org f-r ft12">{{item.BillState | billstate}}</em>
          </div>
          <div class="displayflex acpt-list-body">
            <i class="iconfont icon-cargo"></i>
            <div class="txt flex1" @click="gotoDe(item)">
              <p class="ft17">{{item.MedName}}</p>
              <p>{{item.BBillNo || item.BillNo}}</p>
              <p>{{item.Venue}}  {{item.Address}}</p>
              <p>品种数：{{item.CountSum}}个</p>
              <div class="list-tag"><em class="tag">业务员</em>{{item.BuyerName}}</div>
            </div>
            <div class="acpt-list-btn" >
              <div class="btn mb10" v-if="item.BillState=='P05'" @click="gotoDe(item)">提货</div>
            </div>
          </div>
        </div>
      </div>
      <div v-if="over" class="loader-over">没有更多记录了</div>
    </scroller>
    <div class="noDate_page" v-if="todolist.length==0">
      <div class="noDate_icon"><i class="iconfont icon-null"></i></div>
      暂无数据！
    </div>
    <manage-footer></manage-footer>
  </div>
</template>

<script>
import manageFooter from '@/components/core/footer/manage.footer.vue';
export default {
  name:'driverList',
  components: {
    manageFooter
  },
  data() {
    return {
      sechTxt:'',
      tab:'1',
      todolist:[],
      totalRecords:'',
      pgNo:0,
      Page: 0,
      pgSize:4,
      over:false,
      loadTxt:'上拉加载',
    }
  },
  created(){
    this.sechTxt = sessionStorage.sechtxt;
    this.getdata();
  },
  methods: {
    goLink(val){
      this.tab = val;
      this.getdata(1);
      this.over = false;
    },
    loadMore1 () {
      this.pgNo++;
      this.Page = this.pgNo * this.pgSize;
      this.getdata();
      setTimeout(() => {
        this.$nextTick(() => {
          if(this.todolist.length>0 && this.$refs.Scroller){
            this.$refs.Scroller.donePullup()
          }
          if (this.totalRecords == this.todolist.length) {
            this.$refs.Scroller.disablePullup();
            this.over = true;
          }
        })
      }, 2000)
    },
    gotoDe(item){
      if(this.tab == '2' || item.BillState == 'P05'){
        this.$router.push({
          path:'/order/driverDetail',
          query:{
            id:item.BBillGUID
          }
        })
      }else if(this.tab == '3' || this.tab == '1'){
        sessionStorage.item = JSON.stringify(item)
        this.$router.push({
          path:'/order/doneDetail'
        })
      };
    },
    //获取数据
    getdata(type){
      if (type == 1) {
        this.Page = 0;
        this.pgNo = 0;
        this.todolist = [];
      };
      var self = this;
      var userinfo = JSON.parse(localStorage.userinfo);
      var methodsV = '';
      if(this.tab == '1'){
        var query = {
                    MedName: this.sechTxt,
                    BillNo: this.sechTxt,
                    BespeakGUID: userinfo.StaffID,
                    TenantGuid: userinfo.TenantGUID,
                    CorpGuid: userinfo.CorpGuid,
                    StateList: ['P05','P09','P10','P07'],
                    Page: this.Page,
                    Rows: this.pgSize
                  };
        methodsV = 'TestSearchOrderDelivery';
      }else if(this.tab == '2'){
        var query = {
                    MedName: this.sechTxt,
                    BillNo: this.sechTxt,
                    BespeakGUID: userinfo.StaffID,
                    StateList: ['P05'],
                    LogState:'51',
                    Page: this.Page,
                    Rows: this.pgSize
                  };
        methodsV = 'TestSearchOrderDelivery';
      }else if(this.tab == '3'){
        var query = {
                      MedName: this.sechTxt,
                      BillNo: this.sechTxt,
                      StateList: ['P09','P10','P07'],
                      BespeakGUID:userinfo.StaffID,
                      TenantGuid: userinfo.TenantGUID,
                      CorpGuid: userinfo.CorpGuid,
                      Page: this.Page,
                      Rows: this.pgSize
                    };
        methodsV = 'TestSearchOrderDelivery';
      }
      
      this.Ajax.post(methodsV,query).then(function(resp){
        if (resp.IsSuccess) {
          if(resp.Datas&&resp.Datas.length > 0){
            self.Page++;
            self.todolist = self.todolist.concat(resp.Datas);
          }
          self.totalRecords = resp.TotalRecords; 
          if(self.totalRecords<self.pgSize){
            self.loadTxt = '';
          }
        } else {
          self.Toast({
              message: '列表为空，请稍后刷新',
          });
        };
      });
    },
  }
}
</script>